.icon-color-main {
    color: $app-color-main;
}
.icon-green {
    color: $app-color-main;
}
.icon-white {
    color: $color-white;
}
.icon-gray-1 {
    color: $color-gray-1;
}
.icon-gray-2 {
    color: $color-gray-2;
}
.icon-gray-3 {
    color: $color-gray-6;
}
.icon-gray-4 {
    color: $color-gray-3;
}
.icon-red {
    color: $color-red;
}
.icon-orange {
    color: $color-orange-1;
}
.icon-yellow {
    color: $color-yellow-4;
}
.icon-black {
    color: $color-black;
}

.icon-up {
    width: 0;
    height: 0;
    border-right: 8rpx solid transparent;
    border-left: 8rpx solid transparent;
    border-bottom: 8rpx solid #d8d8d8;
}

.icon-down {
    width: 0;
    height: 0;
    border-right: 8rpx solid transparent;
    border-left: 8rpx solid transparent;
    border-top: 8rpx solid #d8d8d8;
}

.arrow {
    border: solid black;
    border-width: 0 1px 1px 0;
    padding: 3px;
}
.arrow-right {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
}
.arrow-left {
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}
.arrow-up {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
}
.arrow-down {
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}
